<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row style="padding-bottom: 30px;">
          <a-col :span="24" v-if="isShow">
            <a-form-model-item label="编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="number">
              <a-input v-model="model.number" placeholder="请输入编号" disabled></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="报价名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name">
              <a-input v-model="model.name" placeholder="请输入报价名称"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="客户" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="customerId">
              <!--              <j-search-select-tag v-model="model.customerId" dict="biz_customer,name,id"  />-->
              <!--              <JSelectUserByDep></JSelectUserByDep>-->
              <JSelectMultiUser v-model="model.customerId" :query-config="selectUserQueryConfig" :url="kehuurl"
                                @change="kehuChange" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="联系人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="contactsIds">
              <!--              <j-multi-select-tag type="list_multi" v-model="model.contactsIds" dictCode="biz_contacts,name,id" placeholder="请选择联系人" />-->
              <lianxiren v-model="model.contactsIds" :query-config="lianxirenConfig" :multiple="false"
                         :url="lianxirenUrl" v-if="customerIdShow" @change="jihuiChange"></lianxiren>
              <span v-else>无</span>
              <!--              <LIANXIREN v-if="model.customerId" v-model="model.contactsIds" ref="lianxiren" :customerId="model.customerId"></LIANXIREN>-->
              <!--              <span v-else>无</span>-->
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="关联机会" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="opportunityId">
              <!--              <j-search-select-tag v-model="model.opportunityId" dict="biz_sales_opportuninty,name,id"  />-->
              <xiaoshoujihui displayKey="number" v-model="model.opportunityId" :query-config="jihuiConfig"
                             :multiple="false" :url="xiaoshoujihuiUrl" v-if="customerIdShow"></xiaoshoujihui>
              <span v-else>无</span>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="报价人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="bidder">
              <!--              <a-input v-model="model.bidder" placeholder="请输入报价人"  ></a-input>-->
              <j-select-user-by-dep v-model="model.bidder" :multi="false" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="报价时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="bidderTime">
              <j-date placeholder="请选择报价时间" v-model="model.bidderTime" :show-time="true"
                      date-format="YYYY-MM-DD HH:mm:ss" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="有效日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="effectiveDate">
              <j-date placeholder="请选择有效日期" v-model="model.effectiveDate" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="state">
              <j-dict-select-tag type="list" v-model="model.state" dictCode="quotation_state" placeholder="请选择状态" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="负责人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="directorIds">
              <!--              <j-select-user-by-dep v-model="model.directorIds" :multi="true" />-->
              <j-select-user-by-dep v-model="model.directorIds" :multi="true" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="协同人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="collaboratorIds">
              <j-select-user-by-dep v-model="model.collaboratorIds" :multi="true" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="产品" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="productList">
              <!--              <j-multi-select-tag type="list_multi" v-model="model.productIds" dictCode="biz_product,name,id"
                                                placeholder="请选择产品" />-->
              <a-button class="editable-add-btn" @click="chanPinAdd">
                添加产品
              </a-button>
              <ul>
                <li v-for="(i,index) in dataSource" :key="index" class="datasourceLI">
                  <div>
                    <j-popup
                      v-model="i.name"
                      code="query_product"
                      field="name"
                      orgFields="id,name,bar_code,number,unit_price,specifications,unit"
                      destFields="productId,name,barCode,number,unitPrice,specifications,unit"
                      :triggerChange="true"
                      @callback="onPopCellChange(i.key, 'productList',$event)"
                    >

                    </j-popup>
                  </div>
                  <div>
                    <a-input v-model="i.discount" @focus="sove(index)"></a-input>
                  </div>
                  <div>
                    <a-input v-model="i.quotedPrice"></a-input>
                  </div>
                  <div>
                    <a-input v-model="i.quotedPriceTotal"></a-input>
                  </div>
                </li>
              </ul>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="产品合计" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="totalProducts">
              <a-input-number :defaultValue="0" v-model="model.totalProducts" placeholder="请输入产品合计" disabled
                              style="width: 100%"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="整体折扣率" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="discountRate">
              <a-input v-model="model.discountRate" placeholder="请输入折扣率" addon-after="%" style="width: 100%"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="其他费用" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="otherExpenses">
              <a-input-number v-model="model.otherExpenses" placeholder="请输入其他费用" style="width: 100%"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="优惠价钱" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="preferentialAmount">
              <a-input-number v-model="model.preferentialAmount" placeholder="请输入优惠价钱" style="width: 100%"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="报价金额" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="quotationAmount"
                               extra="报价金额=产品合计*整单折扣率+其他费用-优惠金额">

              <a-input-number v-model="model.quotationAmount" placeholder="请输入报价金额" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <!--          <a-col :span="24">
                      <a-form-model-item label="归档" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="filed">
                        <j-dict-select-tag type="list" v-model="model.filed" dictCode="is_filed" placeholder="请选择归档" />
                      </a-form-model-item>
                    </a-col>-->
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

import { httpAction, getAction } from '@/api/manage'
import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDepCustom'
import JSelectMultiUser from '@/components/jeecgbiz/JSelectMultiUserCustom'
import lianxiren from '@/components/jeecgbiz/lianxirenCustom'
import xiaoshoujihui from '@/components/jeecgbiz/xiaoshoujihui/index'
import JSelectUserByDepModalCustom from '@/components/jeecgbiz/modal/JSelectUserByDepModalCustom'
import { validateDuplicateValue } from '@/utils/util'
import LIANXIREN from '@/components/LIANXIREN/index'
import EditableCell from '@/components/EditableCell/cell'

export default {
  name: 'QuotationForm_temp',
  components: {
    JSelectUserByDep,
    JSelectMultiUser,
    JSelectUserByDepModalCustom,
    lianxiren,
    xiaoshoujihui,
    LIANXIREN,
    EditableCell
  },
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  data() {
    return {
      //产品使用
      count: 1,
      dataSource: [],
      columns: [
        {
          title: '产品名称',
          dataIndex: 'name',
          key: 'name',
          width: 200,
          scopedSlots: { customRender: 'name' }
        },
        {
          title: '产品编号',
          dataIndex: 'number',
          width: 200,
          key: 'number',
          scopedSlots: { customRender: 'number' }
        },
        {
          title: '规格',
          dataIndex: 'specifications',
          width: 150,
          key: 'specifications',
          scopedSlots: { customRender: 'specifications' }
        },
        {
          title: '产品条码',
          dataIndex: 'barCode',
          width: 150,
          key: 'barCode',
          scopedSlots: { customRender: 'barCode' }
        },
        {
          title: '报价单位',
          dataIndex: 'unit',
          key: 'unit',
          width: 150,
          scopedSlots: { customRender: 'unit' }
        },
        /* {
          title: '分类',
          dataIndex: 'type',
          key: 'type',
          width: 150,
          scopedSlots: { customRender: 'type' }
        }, */
        {
          title: '数量',
          dataIndex: 'num',
          key: 'num',
          width: 150,
          scopedSlots: { customRender: 'num' }
        },
        {
          title: '单价',
          dataIndex: 'unitPrice',
          key: 'unitPrice',
          width: 150,
          scopedSlots: { customRender: 'unitPrice' }
        },
        {
          title: '折扣(%)',
          dataIndex: 'discount',
          key: 'discount',
          width: 150,
          scopedSlots: { customRender: 'discount' }
        },
        {
          title: '报价',
          dataIndex: 'quotedPrice',
          key: 'quotedPrice',
          width: 150,
          scopedSlots: { customRender: 'quotedPrice' }
        },
        {
          title: '报价小计',
          dataIndex: 'quotedPriceTotal',
          key: 'quotedPriceTotal',
          width: 150,
          scopedSlots: { customRender: 'quotedPriceTotal' }
        },
        {
          title: '备注',
          dataIndex: 'remarks',
          key: 'remarks',
          width: 150,
          scopedSlots: { customRender: 'remarks' }
        },
        {
          title: '操作',
          dataIndex: 'operation',
          key: 'operation',
          width: 100,
          fixed: 'right',
          scopedSlots: { customRender: 'operation' }
        }
      ],
      rules: {
        name: {
          rules: [
            {
              required: true,
              message: '请选择产品'
            }
          ]
        },
        phone: {
          rules: [
            {
              required: true,
              message: '请输入手机号'
            }
            /* {
              validator: (rule, value, callback) =>{
                var reg=/^1[3456789]\d{9}$/
                if(!reg.test(value)){
                  callback(new Error("请输入正确手机号"))
                }else{
                  callback()

                }
              },
              message: '请输入正确手机号',
              trigger: ['change']
            } */
          ]
        }
      },
      customerIdShow: false,
      isShow: false,
      kehuurl: '/customer/customer/list?filed=2&id=',
      // 选择用户查询条件配置
      selectUserQueryConfig: [
        { key: 'phone', label: '电话' }
      ],
      //联系人
      lianxirenUrl: '/sys/common/queryCustomerId?customerId=',
      lianxirenConfig: [
        { key: 'name', label: '姓名' }
        /* {key: 'leixing', label: '类型'},
        {key: 'tel', label: '电话'} */

      ],
      xiaoshoujihuiUrl: '/sys/common/querySalesOpportuninty?customerId=',
      jihuiConfig: [
        { key: 'number', label: '编号' }

      ],
      model: {
        discountRate: 100
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      confirmLoading: false,
      validatorRules: {
        /* number: [
           { required: true, message: '请输入编号!'},
        ], */
        name: [
          { required: true, message: '请输入报价名称!' }
        ],
        customerId: [
          { required: true, message: '请输入客户!' }
        ],
        directorIds: [
          { required: true, message: '请选择负责人' }
        ],
        bidder: [
          { required: true, message: '请输入报价人!' }
        ],
        discountRate: [
          { required: true, message: '请输入整体折扣率!' },
          {
            validator: (rule, value, callback) => {

              if (Number(value) < 1 || Number(value) > 100) {
                callback(false)
              } else {
                callback()

              }
            },
            message: '整单折扣率请控制在1到100之间',
            trigger: ['blur']
          }
        ],
        bidderTime: [
          { required: true, message: '请输入报价时间!' }
        ],
        state: [
          { required: true, message: '请输入状态!' }
        ],
        preferentialAmount: [
          { required: false },
          { pattern: /^(([1-9][0-9]*)|([0]\.\d{0,2}|[1-9][0-9]*\.\d{0,2}))$/, message: '请输入正确的金额!' }
        ],
        quotationAmount: [
          { required: true, message: '请输入!' },
          { pattern: /^(([1-9][0-9]*)|([0]\.\d{0,2}|[1-9][0-9]*\.\d{0,2}))$/, message: '请输入正确的金额!' }
        ]
      },
      url: {
        add: '/quotation/quotation/add',
        edit: '/quotation/quotation/edit',
        queryById: '/quotation/quotation/queryById'
        //:""//编号生成
      }
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    }
  },
  watch: {
    'model.customerId': {
      deep: true,
      handler(newValue, oldValue) {
        // console.log('model.customerID变化')

        if (!newValue || newValue !== oldValue) {
          this.customerIdShow = false
        }
        // console.log('newValue', newValue)
        // console.log('oldValue', oldValue)
        if (newValue) {
          this.$nextTick(() => {
            this.customerIdShow = true
            this.kehuurl = '/customer/customer/list?filed=2&id=' + newValue
            console.log('执行新的kehuurl', this.kehuurl)
            if (this.model.opportunityId) {
              this.xiaoshoujihuiUrl = '/sys/common/querySalesOpportuninty?customerId=' + newValue + '&id=' + this.model.opportunityId
              this.lianxirenUrl = '/sys/common/queryCustomerId?customerId=' + newValue + '&id=' + this.model.contactsIds
            } else {
              this.xiaoshoujihuiUrl = '/sys/common/querySalesOpportuninty?customerId=' + newValue
              this.lianxirenUrl = '/sys/common/queryCustomerId?customerId=' + newValue
            }
          })

        }
        /*  if (this.model.opportunityId) {
           this.xiaoshoujihuiUrl = '/sys/common/querySalesOpportuninty?customerId=' + newValue + '&id=' + this.model.opportunityId
           this.lianxirenUrl = '/sys/common/queryCustomerId?customerId=' + newValue + '&id=' + this.model.contactsIds
         } else {
           this.xiaoshoujihuiUrl = '/sys/common/querySalesOpportuninty?customerId=' + newValue
           this.lianxirenUrl = '/sys/common/queryCustomerId?customerId=' + newValue
         } */

        /* if (!newValue) {
          this.model.opportunityId = ''
          this.model.contactsIds = ''

        } */
      }
    },
    'model.totalProducts': {
      deep: true,
      immediate: false,
      handler(Nval, Oval) {
        // console.log('Oval', Oval)
        // console.log('Nval', Nval)
        this.quotationAmountComputer('totalProducts', Nval)
      }
    },
    'model.discountRate': {
      deep: true,
      immediate: true,
      handler(Nval, Oval) {
        console.log('Oval', Oval)
        console.log('Nval', Nval)
        this.quotationAmountComputer('discountRate', Nval)
      }
    },
    'model.otherExpenses': {
      deep: true,
      immediate: true,
      handler(Nval, Oval) {
        // console.log('Oval', Oval)
        // console.log('Nval', Nval)
        this.quotationAmountComputer('otherExpenses', Nval)
      }
    },
    'model.preferentialAmount': {
      deep: true,
      immediate: true,
      handler(Nval, Oval) {
        // console.log('Oval', Oval)
        // console.log('Nval', Nval)
        this.quotationAmountComputer('preferentialAmount', Nval)
      }
    },
    dataSource: {
      deep: true,
      immediate: true,
      handler(Nval, Oval) {
        // console.log('Oval', Oval)
        console.log('Nval', Nval)
        this.model.quotationAmount = Number(this.model.totalProducts) * Number(this.model.discountRate) / 100 + (this.model.otherExpenses ? Number(this.model.otherExpenses) : 0) - (this.model.preferentialAmount ? Number(this.model.preferentialAmount) : 0)
        // this.$forceUpdate()
      }
    }
  },
  created() {
    //备份model原始值
    this.modelDefault = JSON.parse(JSON.stringify(this.model))
  },
  methods: {
//报价金额变化
    quotationAmountComputer(item, Nval) {
      console.log('总价金额变化quotationAmountComputer()')
      switch (item) {
        case 'discountRate':
          this.model.quotationAmount = Number(this.model.totalProducts) * Number(Nval) / 100 + (this.model.otherExpenses ? Number(this.model.otherExpenses) : 0) - (this.model.preferentialAmount ? Number(this.model.preferentialAmount) : 0)
          break
        case 'totalProducts':
          this.model.quotationAmount = Number(Nval) * Number(this.model.discountRate) / 100 + (this.model.otherExpenses ? Number(this.model.otherExpenses) : 0) - (this.model.preferentialAmount ? Number(this.model.preferentialAmount) : 0)
          break
        case 'otherExpenses':
          this.model.quotationAmount = Number(this.model.totalProducts) * Number(this.model.discountRate) / 100 + (Nval ? Number(Nval) : 0) - (this.model.preferentialAmount ? Number(this.model.preferentialAmount) : 0)
          break
        case 'preferentialAmount':
          this.model.quotationAmount = Number(this.model.totalProducts) * Number(this.model.discountRate) / 100 + (this.model.otherExpenses ? Number(this.model.otherExpenses) : 0) - (Nval ? Number(Nval) : 0)
          break
        default:
          break
      }

      /* console.log('================')
      console.log('quotationAmount', this.model.quotationAmount)
      console.log('totalProducts', Number(this.model.totalProducts))
      console.log('discountRate', Number(this.model.discountRate))
      console.log('otherExpenses', this.model.otherExpenses)
      console.log('preferentialAmount', this.model.preferentialAmount)
      console.log('================') */
    },
    //售价change
    onQuotedPriceInputChange(key, dataIndex, value) {
      console.log('售价value', value)
    },
    //移除产品列表里的某一条产品
    contactsDel(index) {
      console.log(index)
      this.dataSource.splice(index, 1)
      this.model.productList = this.dataSource
    },
    kehuChange(e) {
      console.log(e)
      this.customerIdShow = false
      this.model.opportunityId = ''
      this.model.contactsIds = ''
      /* this.xiaoshoujihuiUrl = '/sys/common/querySalesOpportuninty?customerId=' + e
      this.lianxirenUrl = '/sys/common/queryCustomerId?customerId=' + e */
    },
    jihuiChange(e) {
      console.log(e)
    },
    add() {
      this.edit(this.modelDefault)
      this.isShow = false
      // this.model.discountRate = 100  //默认折扣率
      this.model.totalProducts = 0  //默认产品合计
    },
    edit(record) {
      this.isShow = true
      this.model = Object.assign({}, record)
      let count = 0
      console.log('==============record', record)
      if (record.productList) {
        record.productList.map(res => {
          res.key = count += 1
          return res
        })
        console.log('编辑初始化产品列表', record.productList)
        this.dataSource = record.productList
      }

      this.visible = true
      /* if (record.id) {
        this.kehuurl = '/customer/customer/list?id=' + record.id
      } */
    },
    submitForm() {
      console.log('this.model', this.model)
      this.model.productList = this.dataSource
      // debugger
      const that = this
      // 触发表单验证
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'put'
          }
          httpAction(httpurl, this.model, method).then((res) => {
            if (res.success) {
              that.$message.success(res.message)
              that.$emit('ok')
            } else {
              that.$message.warning(res.message)
            }
          }).finally(() => {
            that.confirmLoading = false
          })
        }

      })
    },
    onCellChange(key, dataIndex, value) {
      console.log('key', key)
      console.log('dataIndex', dataIndex)
      console.log('value', value)
    },
    //产品====数量 报价 折扣====改变
    popNumChange(key, dataIndex, value) {
      const dataSource = [...this.dataSource]
      const target = dataSource.find((item) => item.key === key)
      console.log('改变target', target)

      switch (dataIndex) {
        case 'num'://数量
          //数量会影响==报价小计==
          target.num = value
          target.quotedPriceTotal = value * target.quotedPrice
          this.totalProductsComputer()//总价计算

          break
        case 'discount'://折扣率
          console.log('检验折扣率', target)
          //折扣率会影响==报价小计+报价==
          target.discount = value
          target.quotedPrice = Number((target.unitPrice * value / 100).toFixed(2))
          target.quotedPriceTotal = target.num * target.quotedPrice
          this.totalProductsComputer()

          break
        case 'quotedPrice'://报价
          //报价会影响==报价小计+折扣率==
          console.log('检验报价')
          target.quotedPrice = value
          target.discount = (value / target.unitPrice * 100).toFixed(2)
          target.quotedPriceTotal = target.num * value
          this.totalProductsComputer()
          // this.model.totalProducts =target.num * value

          break
        default:
          break
      }

      this.dataSource = dataSource

    },
    //总价计算
    totalProductsComputer() {
      let all = 0
      this.dataSource.forEach(res => {
        all += Number(res.quotedPriceTotal)
      })
      console.log('all', all)
      this.model.totalProducts = all
      // return all
    },
    onPopCellChange(key, dataIndex, value) {
      console.log('key', key)
      console.log('dataIndex', dataIndex)
      console.log('value', value)
      const dataSource = [...this.dataSource]
      // let target = null
      const target = dataSource.find((item) => item.key === key)

      console.log('target', target)

      if (target) {
        // target[dataIndex] = value
        // dataSource[dataIndex].endDate = ''
        // dataSource[dataIndex].startDate = ''
        /*  target.map((item) => {
           console.log(item.key)
           if (item.key === key) { */
        //产品ID
        target.productId = value.productId
        //名称
        target.name = value.name
        //编号
        target.number = value.number
        //规格
        target.specifications = value.specifications
        //产品条码
        target.barCode = value.barCode
        //产品分类
        // item.type = value.type
        //报价单位
        target.unit = value.unit
        //数量
        target.num = 1
        //单价
        target.unitPrice = value.unitPrice
        //折扣率
        target.discount = (value.unitPrice / value.unitPrice * 100).toFixed(2)
        //售价
        target.quotedPrice = value.unitPrice
        //报价小计
        target.quotedPriceTotal = this.model.totalProducts = value.unitPrice * target.num
        //备注
        target.remarks = ''
        /*   return item
        } else {
          return item
        }
      }) */
        this.dataSource = dataSource
        console.log('dataSource', this.dataSource)
      } else {
        this.$message.error('产品列表错误')
        /* target[dataIndex] = value
        this.dataSource = dataSource */
      }
      this.quotationAmountComputer()//报价金额变化
      this.totalProductsComputer() //表单内总价计算
    },
    // input Change事件
    onInputChange(key, dataIndex, value) {
      const dataSource = [...this.dataSource]
      const target = dataSource.find((item) => item.key === key)
      if (target) {
        target[dataIndex] = value == '' ? undefined : value
        this.dataSource = dataSource
      }
    },
    //添加产品
    chanPinAdd() {
      const { count, dataSource } = this
      const newData = {
        key: count,
        name: '',//产品名称
        number: '',//产品编号
        barCode: '',//产品条码
        // type: '',//分类
        unit: '',//产品单位
        unitPrice: '',//单价
        specifications: ''//规格
      }
      this.dataSource = [...this.dataSource, newData]
      console.log('添加产品时dataSource', this.dataSource)
      // this.dataSource.push(newData)
      this.count += 1
    },
    jpopCallBack(e) {
      console.log('e', e)
    },
    sove(index) {
      console.log('11111')
      this.$forceUpdate()
      this.$set(this.dataSource[index], 'unitPrice', 333)
    }
  }
}
</script>
<style scoped lang="less">
.datasourceLI {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
</style>